<link rel="stylesheet" href="debatewise.gadgets.css" type="text/css" /> 
<script type="text/javascript"> 
	if ((document.getElementById)||(document.layers)) {
		var doc = document;
	} else {
		var doc = document.all;
	}
  function toggleVisible(id) {
    if(doc.getElementById(id).style.display=="none"){
      doc.getElementById(id).style.display = "block";
    } else {
      doc.getElementById(id).style.display = "none";
    }
  }
 
// --- Page specific functions
  function castVote(Bool) {
    // 1 = for, 0=against
  }
  function joinPoint() {
    
  }
  function makeLiPoint() {
    // h4 class pointer onclick=toggleVisible(pointid) + span color=red/green (pro/con) + point title
    // p "Point rating " + span color=red/green (pro/con) + rating
    // div id="point-"+point id  style=display:none
      // h4 Point creator:
      // p creator + created time
      // h4 "Point"
      // p point
      // h4 "Counter point:"
      // p counterpoint
    // h4 class=pointer onclick=joinPoint(id) + "Discuss this point >"
  }
  function makeDebate() {
    // get data
    // template meta-div:
      // id debate-title
      // id debate-proposition
      // id debate-opposition
      // id your-vote
      // id start-time
      // id debate-end-time
      // id vote-end-time
      // id time-remaining
    // list points:
      // for each point:
        // makeLiPoint(json.points[i])
        // append li to ul id debate-points
  }
</script> 
<div id="debate"> 
  <div id="div-title" class="meta-div greyBG paddingBottom8px"> 
            <h3 class="horizontalLineTop">Debate 10</h3> 
    <h1 class="debate-headline paddingLeftRight8px" id="debate-title" style="width:100%">Motion: How may ninjas does it take to cut emissions by 20% before 2015? Answer: Chuck Norris</h1> 
		<p id="proposition" class="paddingLeftRight8px"><span class="propOpp">Proposition:</span> There isn't a man made phenomenon that Chuck Norris cannot sindle handedly defeat. Climate change would have to be made out of Chuck Norris for Chuck Norris to even have the slightest difficulty in defeating it. <a href="#">Here's the proof!</a></p> 
		<p id="opposition" class="paddingLeftRight8px"><span class="propOpp">Opposition:</span> Chuck Norris hasn't actually got any special powers. In fact, he's not even very good at martial arts at all. Except his inward heel kick: that's really classy. Basically, it's all camera trickery and jump cuts - and you know you can't jump cut your way out of a natural disaster.</p> 
    <div id="debate-voting-div" class="paddingLeftRight8px"> 
      <b>Vote totals:</b> 
      <div class="debateVoteTotals bold">Supporting: <span class="yesColour fontSizeUp" id="votes-for">+118</span></div> 
      <div class="debateVoteTotals bold">Opposing: <span class="noColour fontSizeUp" id="votes-against">-177</span></div> <br />
      <div class="debateVoteTotals">Your vote: <span id="your-vote" class="bold">You haven't voted yet</span></div> 
      <h2>Cast your vote: </h2> 
      <h2><span class="yesColour" id="vote-for" onclick=castVote(1)>FOR</span>|&nbsp;&nbsp;&nbsp;<span class="noColour" id="vote-against" onclick=castVote(0)>AGAINST</span></h2> 
    </div> 
    <p class="small paddingLeftRight8px"><span id="debate-start-time">Started: 27th November, 11.30am.</span><br /><span id="debate-end-time">Debate ends: 28th November, 11.30am.</span><br /><span id="vote-end-time">Vote ends: 29th November, 11.30am.</span></p> 
    <h2 class="paddingLeftRight8px"><span class="yesColour" id="time-remaining">19 minutes remaining</span></h2> 
  </div> <br />
	<div id="debates-list-div"> 
   
    <h1>Points:</h1> <p class="explanation">Click the title to show the summary</p>
		<div id="debate-points-div"> 
      <ul class="list" id="debate-points"> 
        <li onclick="toggleVisible('point-10')"> 
          <h3 class="pointer noUnderline"><span class="yesColour">Chuck Norris has stared death in the face. Death flinched.</span></h3> 
          <div id="point-10" style="display:none"> 
          <p>Point rating: <span class="noColour">-28</span></p> 
            <h4>Originator: </h4> 
            <p>Hamed Kharzai, 27th November 6.30pm</p> 
            <h4>Point: </h4> 
            <p>This could be quite a substantial paragraph, so I'll just keep waffling on here for a minute or two's worth of dummy text. Hmm... are you still reading this? You really shouldn't be. It is not informative. It is just junk chars that I am padding out a paragraph with. Never mind.</p> 
            <h4>Counter point: </h4> 
            <p>There is no counter point yet.</p> 
          <h2 class="pointer" onclick="joinPoint('10')">Discuss this point ></h2> 
          </div> 
        </li> 
        <li> 
          <h3 class="pointer noUnderline" onclick="toggleVisible('point-14')"><span class="noColour">Chuck Norris has nothing to do with climate change, this debate makes a mockery of science and nature.</span></h3> 
          <div id="point-14" style="display:none"> 
          <p>Point rating: <span class="yesColour">+8</span></p> 
            <h4>Originator: </h4> 
            <p>Jorge Luis Borges, 27th November 3.14pm</p> 
            <h4>Point: </h4> 
            <p>This could be quite a substantial paragraph, so I'll just keep waffling on here for a minute or two's worth of dummy text. Hmm... are you still reading this? You really shouldn't be. It is not informative. It is just junk chars that I am padding out a paragraph with. Never mind.</p> 
            <h4>Counter point: </h4> 
            <p>There is no counter point yet.</p> 
          <h2 class="pointer" onclick="joinPoint('14')">Discuss this point ></h2> <br />
          </div> 
        </li> 
      </ul> 
	  </div> 
	</div> 
</div> 